<script setup lang='ts' name="detail-view">
import UpdatedOss from '@fl/components/upLoad-oss.vue'
import { useAesDecrypt } from '@fl/hooks/web/useCrypt'
import { ElDialog, ElForm, ElFormItem, ElTag } from 'element-plus'
import { ref, toRefs, watch } from 'vue'

import { useDicts } from '../hooks/use-dicts'

const props = withDefaults(defineProps<{
    data?: any
    modelValue: boolean
}>(), {
    data: () => { },
})

const emits = defineEmits(['update:modelValue', 'confirm'])
const { useDict } = useDicts()
const detail = ref<any>({})
const { data, modelValue } = toRefs(props)

function close() {
    emits('update:modelValue', false)
}
function filterUrl(str: string) {
    return str ? JSON.parse(str) : []
}
watch(data, (val: any) => {
    console.log('二级企业详情', val)
    detail.value = {
        ...val,
    }
}, {
    deep: true,
})
</script>

<template>
    <ElDialog v-model="modelValue"
              width="960"
              title="企业详情"
              @close="close"
    >
        <div class="info-title">
            企业注册信息
        </div>

        <ElForm :model="detail"
                label-width="auto"
        >
            <ElRow :gutter="20">
                <ElCol :span="8">
                    <ElFormItem label="企业号:"
                                prop="enterpriseId"
                    >
                        {{ detail?.enterpriseId }}
                    </ElFormItem>
                </ElCol>

                <ElCol :span="8">
                    <ElFormItem label="企业名称:">
                        {{ detail?.enterpriseName }}
                    </ElFormItem>
                </ElCol>

                <ElCol :span="8">
                    <ElFormItem label="所属城市:">
                        {{ detail?.areaName }}
                    </ElFormItem>
                </ElCol>

                <ElCol :span="8">
                    <ElFormItem label="企业简称:">
                        {{ detail?.enterpriseShort }}
                    </ElFormItem>
                </ElCol>
            </ElRow>

            <ElRow :gutter="20">
                <ElCol :span="8">
                    <ElFormItem label="统一社会信用代码:">
                        {{ detail?.unifiedSocialCreditCode }}
                    </ElFormItem>
                </ElCol>

                <ElCol :span="8">
                    <ElFormItem label="企业级别:">
                        <ElTag :type=" detail?.enterpriseLevelId === '1' ? 'warning' : 'success'">
                            {{ detail.enterpriseLevel }}
                        </ElTag>
                    </ElFormItem>
                </ElCol>

                <ElCol :span="8">
                    <ElFormItem label="企业联系电话:">
                        {{ detail.registeredMobile }}
                    </ElFormItem>
                </ElCol>
            </ElRow>

            <ElRow :gutter="20">
                <ElCol :span="8">
                    <ElFormItem label="企业类型:">
                        {{ detail.enterpriseTypeName }}
                    </ElFormItem>
                </ElCol>

                <ElCol :span="8">
                    <ElFormItem label="业务类别:">
                        {{ detail.catType }}
                    </ElFormItem>
                </ElCol>

                <ElCol :span="8">
                    <ElFormItem label="合作类型:">
                        {{ useDict('CooperationType', detail.cooperationType) }}
                    </ElFormItem>
                </ElCol>
            </ElRow>

            <ElRow :gutter="20">
                <ElCol :span="8">
                    <ElFormItem label="注册日期:">
                        {{ detail?.establishmenDate?.split('T')[0] || '' }}
                    </ElFormItem>
                </ElCol>

                <ElCol :span="8">
                    <ElFormItem label="企业法人:">
                        {{ detail?.legalRepresentative }}
                    </ElFormItem>
                </ElCol>

                <ElCol :span="8">
                    <ElFormItem label="法人证件号码:">
                        {{ useAesDecrypt(detail?.legalCard) }}
                    </ElFormItem>
                </ElCol>
            </ElRow>

            <ElRow :gutter="20">
                <ElCol :span="8">
                    <ElFormItem label="营业执照">
                        <UpdatedOss v-model="detail.businessLicense"
                                    :disabled="true"
                                    :file-list="filterUrl(detail?.businessLicensehx)"
                        />
                    </ElFormItem>
                </ElCol>

                <ElCol :span="8">
                    <ElFormItem label="企业法人身份证(正面)">
                        <UpdatedOss v-model="detail.legalCardFront"
                                    :disabled="true"
                                    :file-list="filterUrl(detail?.qyfrsfzzmurhx)"
                        />
                    </ElFormItem>
                </ElCol>

                <ElCol :span="8">
                    <ElFormItem label="企业法人身份证(反面)">
                        <UpdatedOss v-model="detail.legalCardBack"
                                    :disabled="true"
                                    :file-list="filterUrl(detail?.legalRepresentativesfzfmurhx)"
                        />
                    </ElFormItem>
                </ElCol>
            </ElRow>

            <ElFormItem label="企业注册地址:">
                {{ detail?.registeredAddress }}
            </ElFormItem>

            <div class="info-title">
                企业管理员信息
            </div>

            <ElRow :gutter="20">
                <ElCol :span="8">
                    <ElFormItem label="企业管理员账号:">
                        {{ detail?.enterpriseAccount }}
                    </ElFormItem>
                </ElCol>

                <ElCol :span="8">
                    <ElFormItem label="姓名:">
                        {{ detail?.userName }}
                    </ElFormItem>
                </ElCol>

                <ElCol :span="8">
                    <ElFormItem label="身份证号:">
                        {{ useAesDecrypt(detail?.idCard) }}
                    </ElFormItem>
                </ElCol>
            </ElRow>

            <ElRow :gutter="20">
                <ElCol :span="8">
                    <ElFormItem label="手机号:">
                        {{ useAesDecrypt(detail?.phonenumber) }}
                    </ElFormItem>
                </ElCol>

                <ElCol :span="8">
                    <ElFormItem label="邮箱:">
                        {{ detail?.email }}
                    </ElFormItem>
                </ElCol>
            </ElRow>
        </ElForm>
    </ElDialog>
</template>

<style lang="less" scoped>
.info-title {
    font-size: 16px;
    font-weight: 600;
    line-height: 50px;
}
</style>
